<template>
<div align="center">
  <h2>{{title}}</h2>
  <h3>{{text}}</h3>
  <h3>请输入您要购买的斤数: <input type="text" v-model.number="res"></h3>
  <button @click="fn">结账买单</button>
  <h1>结账单：总价:{{price}}￥元 ----折后价:{{foldback}}￥元----节省:{{save}}￥元</h1>
 
</div>
  
</template>

<script>
export default {
  data(){
    return{
      title:'欢迎光临水果店',
      text:'苹果10￥/斤,折扣<8>折',
      res:'',
      price:'',
      foldback:'',
      save:''



    }
  },
  methods:{
    fn(){
      this.price=this.res*10
      this.foldback=this.price-2*this.res
      this.save=this.price-this.foldback
      
    }
  }
}
</script>

<style>

</style>